<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/reset.css">
    <link rel="stylesheet" href="./css/豆瓣.css">
</head>
<body>
    <!-- 页面 -->
    <main>
        <!-- 头部 -->
<header>
    <!-- 导航1 -->
    <nav class="nav1">
       <a href="">豆瓣 </a>
       <a href="">读书</a>
       <a href="">电影</a>
       <a href="">音乐</a>
       <a href="">同城</a>
       <a href="">小组</a>
       <a href="">阅读</a>
       <a href="">FM</a>
       <a href="">东西</a>
       <a href="">集市</a>
       <a href="">更多</a>
       <a href="">下载豆瓣客服端</a>
       <a href="">提醒</a>
       <a href="">豆邮</a>
    </nav>
    <!-- 导航2 -->
    <nav class="nav2">
        <div>
            <a href=""><img src="img/lg_main_a11_1.png" alt=""></a>
            <a href="">首页</a>
            <a href="">我的豆瓣</a>
            <div><a href="">浏览发现
            </a>
            <sup><img src="img/index_03.png" alt=""></sup></div>
            
            <a href="">移动应用</a>
            <a href="">游戏</a>
            <a href="">线上活动</a>
            <input type="text" placeholder="搜索你感兴趣的内容和人..."
            >
        </div>
    </nav>
</header>
<!-- 主题 -->
<section>
    <!-- 左边主题 -->
    <article>
        <!-- 导航栏 -->
     <div class="article">
         <div>
            <a href=""><span></span>说句话</a>
            <a href=""><span></span>发照片</a>
            <a href=""><span></span>推荐网页</a>
            <a href=""><span></span>写日记</a>
            <a href=""><span></span>发布东西</a>
            <a href=""><span></span>首页设置</a>
         </div>
            <div>
                <input type="text" placeholder="分享生活点滴.....">
            </div>
        
     </div>
     <!-- Violet 的日记 -->
     <div class="article1">
        <div>
           <a href="">
            <img src="img/u3430152-98.jpg" alt="">
           </a> 
        </div>
        <div class="diary">
            <div><p>
                <a href="">
                    Violet 的日记：
                </a>
            </p>
                
            </div>
            <div class="diary4">
                <div class="diary1">
                    <h3><a href="">怪力八面体-胡夫金字塔</a>
                      </h3>
                      <p>
                        前几天看到有人在广播发了这个，
                        搜了一似乎也没有人针对这个写过文，
                        我就斗胆先写一个吧，因为觉得这件事真的很好玩。。。
                        吉萨的三座大金塔里，有一座是一个八面体。
                        这个八面体金字塔...
                      </p>
                     <div><a href=""><span></span>
                        喜欢</a> 
                </div></div>
                <div class="img">
                   <a href="">
                    <img src="img/p35801459.jpg" alt="">
                   </a> 
                </div>
                
            </div>
            <div>
             <p>
                1小时前，来自 热门精选
             </p>
            </div>
        </div>
     </div>
     <!-- 李青菜的日记 -->
     <div class="article1">
        <div>
            <a href="">
             <img src="img/02.png" alt="">
            </a> 
         </div>
         <div class="diary">
             <div><p>
                 <a href="">
                    李青菜 的日记：
                 </a>
             </p>
                 
             </div>
             <div class="diary4">
                 <div class="diary1">
                     <h3><a href="">黄秀兰的夏天</a>
                       </h3>
                       <p>
                        坐好，听我说，无论你多爱小动物，
                        都不要给流浪猫取名字，
                        一旦取了名字，TA就是你的，
                        你就是TA的，一切都不一样了。
                        2011年9月20日，第一次看见TA，
                        惊艳于TA的英俊帅气，
                        马上取名詹姆斯·邦...
                       </p>
                      <div><a href=""><span></span>
                         喜欢</a> 
                 </div></div>
                 <div class="img">
                    <a href="">
                     <img src="img/002.png" alt="">
                    </a> 
                 </div>
                 
             </div>
             <div>
              <p>
                 今天上午，来自 热门精选
              </p>
             </div>
         </div>
     </div>
     <!-- 赵志明的日记 -->
     <div class="article1">
        <div>
            <a href="">
             <img src="img/03.png" alt="">
            </a> 
         </div>
         <div class="diary">
             <div><p>
                 <a href="">
                    赵志明 的日记：
                 </a>
             </p>
                 
             </div>
             <div class="diary3">
                 <div class="essay">
                     <h3><a href="" class="a1">“中国怪谭系列”之29：
                         骷髅行乞</a>
                       </h3>
                       <p>
                        有道是：“人生如寄，好比骷髅借肉身，
                        锦衣夜行不自知。”1 发千年难遇大水的时候，
                        西湖边某处墓穴被水流泡松冲开，里面的两具骷髅暴露出来
                        。有个云游的仙人恰好路过，想将它们重新安葬。
                        ...
                       </p>
                      <div><a href=""><span></span>
                         喜欢</a> 
                 </div></div>
                 
             </div>
             
             <div>
              <p>
                 今天上午，来自 热门精选
              </p>
             </div>
         </div>
     </div>
     <!-- can的日记  -->
     <div class="article1">
        <div>
            <a href="">
             <img src="img/04.png" alt="">
            </a> 
         </div>
         <div class="diary">
             <div><p>
                 <a href="">
                    cancel 的日记：
                 </a>
             </p>
                 
             </div>
             <div class="diary4">
                 <div class="diary1">
                     <h3><a href="">又走完了一段儿</a>
                       </h3>
                       <p>
                        上个月，豆子的幼儿园生活进入倒计时阶段，
                        我向老师提出进园跟拍一天的请求也被批准了
                        。于是，一个难得的晴天，
                        我旁观了小朋友们一天的生活，
                        也算是了了一个长久的心愿。刚一开始，
                        小朋友对...
                       </p>
                       <div>
                        <div class="pag"><a href=""><span></span>
                            喜欢</a>  <a href=""> 丨 标签：</a>
                            <a href="">人文</a>
                            <a href="">摄影</a>
                            <a href="">成长</a>
                            <a href="">教育</a>
                            <a href="">儿童</a>
                    </div>
                       </div>
                     
                </div>
                 <div class="img">
                    <a href="">
                     <img src="img/003.png" alt="">
                    </a> 
                 </div>
                 
             </div>
             <div>
              <p>
                 今天上午，来自 热门精选
              </p>
             </div>
         </div>
     </div>
     <!-- 青简的相册 -->
     <div class="article1">
        <div>
            <a href="">
             <img src="img/05.png" alt="">
            </a> 
         </div>
         <div class="diary">
             <div><p>
                 <a href="">
                    青简 的相册：
                 </a>
             </p>
                 
             </div>
             <div class="diary5">
                 <div class="essay">
                     <a href="">
                         <img src="img/1.png" alt="">
                     </a>
                     <a href="">
                         <img src="img/2.png" alt="">
                     </a>
                     <a href="">
                         <img src="img/3.png" alt="">
                     </a>
                     <a href="">
                         <img src="img/4.png" alt="">
                     </a>
                     <h3><a href="">富春新安</a>
                     </h3>
                       <div>
                        <div class="pag"><a href=""><span></span>
                            喜欢</a>  <a href=""> 丨 标签：</a>
                            <a href="">摄影</a>
                            <a href="">旅行</a>
                            <a href="">江南</a>
                            <a href="">自然</a>
                            <a href="">人文</a>
                    </div>
                       </div>
                </div>
             </div>
             <div>
              <p>
                 今天上午，来自 热门精选
              </p>
             </div>
         </div>
     </div>
     <!-- 页数 -->
     <div class="last">
       <a href="">＜前页</a>
       <a href="">1</a>
       <a href="">2</a>
       <a href="">3</a>
       <a href="">4</a>
       <a href="">5</a>
       <a href="">6</a>
       <a href="">7</a>
       <a href="">8</a>
       <a href="">9</a>
       <a href="">...</a>
       <a href="">后页＞</a>
     </div>
    </article>
    <!-- 右边主题 -->
    <aside>
    <div class="aside1">
        <P><a href="">豆瓣正在发生······</a></P>
        <P><a href="">哈利·波特第八部全球同步上架</a></P>
        <P><a href="">China Joy优秀游戏鉴赏</a></P>
    </div>
    <div class="aside2">
        <a href="">
            <img src="img/999.png" alt="">
        </a> 
    </div>
    <div class="aside3">
        <p><a href="">>申请创建小站</a>
        </p>
    </div>
    <div class="aside4">
       <a href="">
        <img src="img/index_douban_ad_4.png" alt="">
       </a> 
    </div>
    <div class="aside5">
        <a href="">热门活动</a>
        <a href=""> · · · · · · </a>
        <a href="">( 换一个)</a>
    </div>
    <div class="aside6">
       <div>
           <p><a href="">给我看看你们的美好工作台吧~</a></p>
       <p>时间：6月27日-8月26日</p>
       <p>参加：266人参加</p>
    </div>
       <div><a href="">
        <img src="img/o702700.jpg" alt="">
       </a></div>
    </div>
    <div class="aside7">
        <a href="">>更多线上活动</a>
        
    </div>
    <div class="aside5">
        <a href="">豆瓣一拍一</a>
        <a href=""> · · · · · · </a>
        <a href="">( 更多 )</a>
    </div>
    <div class="aside9">
        <div>
       <img src="img/888.png" alt="">
        </div>
        <div>
            <p><a href="">很高兴遇见你</a></p>
            <p>城市：厦门</p>
            <p>价格：2400</p>
        </div>
    </div>
    <div class="aside9">
        <div>
            <img src="img/777.png" alt="">
             </div>
             <div>
                 <p><a href="">微套系 | 至真系列</a></p>
                 <p>城市：北京</p>
                 <p>价格：1480</p>
             </div>
    </div>
    <div class="aside11">
        <a href="">>已开放17个城市</a>
    </div>
    <div class="aside12">
<a href="">
    <img src="img/1e645caf4e73682.jpg" alt="">
</a>
    </div>
    </aside>
</section>
<!-- 脚部 -->
<footer>
<div><p>
    ©2005-2016douban.com,all rights reserved 北京豆网科技有限公司
</p>
    
</div>
<div>
    <p>
        <a href="">关于豆瓣</a> · 
        <a href="">在豆瓣工作</a> · 
        <a href="">联系我们</a> · 
        <a href="">免责声明</a> · 
        <a href="">帮助中心</a> · 
        <a href="">移动应用</a> · 
        <a href="">豆瓣广告</a>
    </p>
    
</div>
</footer>
    </main>
</body>
</html>